@charset "utf-8";
@function n($px) {
    @return $px/2;
}
$border-color: #ff9344;
.web {
    .header_top {
        padding: n(47px) n(8px) 0 n(13px);
        .we_top_box {
            .header_top_left {
                float: left;
                input {
                    width: n(123px);
                    height: n(57px);
                    border: 3px solid $border-color;
                    border-radius: n(17px);
                    font-size: n(26px);
                    background: white;
                }
            }
            .header_top_right {
                position: relative;
                float: right;
                vertical-align: middle;
                img {
                    width: n(62px);
                    height: n(42px);
                }
                .shuzi{
                    text-align: center;
                    position: absolute;
                    top: n(-16px);
                    right: n(-16px);
                    width: n(35px);
                    height: n(35px);
                    background: red;
                    border-radius: n(17px);
                    color: white;
                    line-height: n(26px);
                   opacity: .6;
                }
            }
            .header_top_center {
                text-align: center;
                overflow: hidden;
                h4 {
                    line-height: n(61px);
                    vertical-align: middle;
                    font-size: n(26px);
                }
            }
        }
        .header_middel {
            line-height: n(170px);
            margin-top: n(19px);
            .header_middel_left {
                float: left;
                width: n(170px);
                height: n(170px);
                vertical-align: middle;
                img {
                    width: 100%;
                }
            }
            .header_middel_center {
                float: left;
                vertical-align: middle;
                line-height: n(70px);
                margin-left: n(23px);
                h4 {
                    a {
                        font-size: n(30px);
                        color: #000000;
                    }
                }
                h5 {
                    a {
                        font-size: n(26px);
                        color: #9d9d9d;
                    }
                }
            }
            .header_middel_right {
                float: right;
                width: n(41px);
                height: n(46px);
                img {
                    width: 100%;
                }
            }

        }
        .header_bottom_box {

            margin-top: n(25px);
            ul {
                list-style: none;
                text-align: center;
                li {
                    width: 31%;
                    height: 75px;
                    text-align: center;
                    margin-right: 2%;
                    float: left;
                    img {
                        height: 54%;
                        margin-top: 10px;
                    }
                    h4 {
                        font-size: n(26px);
                    }
                }
                li:first-of-type {
                    background: #b2e0a0;
                }
                li:nth-of-type(2) {
                    background: #a0dce0;
                }
                li:last-of-type {
                    background: #e0b7a0;
                }
            }
        }

    }
    .icon_bottom_box {
        padding: 0 n(21px) 0 n(23px);
        margin-top: n(26px);
        .icon_m {
            margin-top: n(26px);
            line-height: n(74px);
            .icon_m_left {
                float: left;
                img {
                    vertical-align: middle;
                    width: n(57px);
//                  height: n(74px);
                }

                span {
                    vertical-align: middle;
                    margin-left: n(18px);
                    font-size: n(26px);
                }
            }
            .icon_d_left {
                float: left;
                img {
                    vertical-align: middle;
                    width: n(57px);
//                  height: n(74px);
                }

                span {
                    vertical-align: middle;
                    margin-left: n(18px);
                    font-size: n(26px);
                }
            }
            .icon_z_left {
                float: left;
                img {
                    vertical-align: middle;
                    width: n(57px);
//                  height: n(74px);
                }

                span {
                    vertical-align: middle;
                    margin-left: n(18px);
                    font-size: n(26px);
                }
            }
            .icon_w_left {
                float: left;
                img {
                    vertical-align: middle;
                    width: n(57px);
//                  height: n(74px);
                }

                span {
                    vertical-align: middle;
                    margin-left: n(18px);
                    font-size: n(26px);
                }
            }
            .icon_m_right {
                float: right;
                a {
                    span {
                        color: #000000;
                        font-size: n(24px);
                        vertical-align: middle;
                    }
                    i {
                        font-size: n(45px);
                        color: $border-color;
                        vertical-align: middle;
                    }
                }
            }
        }

    }
    .icon_bottom {
        padding: 0 n(21px) 0 n(30px);
        margin-top: n(78px);
        .shezhi {
            .icon_sz_left {
                float: left;
                img {
                    vertical-align: middle;
                    width: n(78px);
                    height: n(79px);
                }

                span {
                    vertical-align: middle;
                    margin-left: n(9px);
                    font-size: n(26px);
                }
            }
            .icon_sz_right {
                float: right;
                a {
                    span {
                        color: #000000;
                        font-size: n(24px);
                        vertical-align: middle;
                    }
                    i {
                        font-size: n(45px);
                        color: $border-color;
                        vertical-align: middle;
                    }
                }
            }
        }
        .dianhua {
            margin-top: n(24px);
            .icon_dh_left {
                float: left;
                img {
                    vertical-align: middle;
                    width: n(84px);
                    height: n(59px);
                }

                span {
                    vertical-align: middle;
                    margin-left: n(9px);
                    font-size: n(26px);
                }
            }
            .icon_sz_right {
                float: right;
                a {
                    span {
                        color: #000000;
                        font-size: n(24px);
                        vertical-align: middle;
                    }
                    i {
                        font-size: n(45px);
                        color: $border-color;
                        vertical-align: middle;
                    }
                }
            }
        }
    }
    .input_bottom {
        text-align: center;
        height: n(76px);
        input {
            margin: 0 n(40px);
            width: n(147px);
            height: n(76px);
            border-radius: n(33px);
            background: $border-color;
        }
    }

}
